<template>
    <div id="app">
        <a-layout>
            <a-layout-header style="padding: 0 20px;text-align: center">
                <a-button @click="prev" type="default" size="small" :hidden="hidden">
                    <a-icon type="left"/>
                </a-button>
<!--                <label style="font-size: large; float: right; width:70%; height:auto;">{{myTitle}}</label>-->
                <label style="font-size: large; height:auto;"><a-icon type="home" />  {{myTitle}}</label>
            </a-layout-header>
            <a-layout-content style="background-color: #f3f4f7">
                <RouterView/>
            </a-layout-content>
            <a-layout-footer>方远™集团</a-layout-footer>
        </a-layout>
    </div>
</template>

<script>

    export default {
        name: 'App',
        // components: {
        //   BlockList
        // }
        data() {
            return {
                myTitle: '方远物业业主管理系统',
                hidden: true,
            }
        },
        provide() {
            return {
                setTitle: this.setTitle,
                setHidden: this.setHidden,
            }
        },
        methods: {
            prev() {
                this.$router.go(-1);
                this.hidden = true;
            },
            setTitle(title) {
                this.myTitle = title;
            },
            setHidden (hidden) {
                hidden = true;
                this.hidden = hidden;
            }
        }
    }
</script>

<style>
    #app .ant-layout-header,
    #app .ant-layout-footer {
        background: #7cccea;
        color: #fff;
        height: 40px;
        line-height: 40px;
    }

    #app .ant-layout-footer {
        height: 20px;
        text-align: center;
    }

    #app .ant-layout-footer {
        line-height: 0px;
    }

    #app .ant-layout-content {
        background: #ffffff;
        color: #000;
        min-height: 640px;
        /*line-height: 0px;*/
    }

    #app > .ant-layout {
        margin-bottom: 48px;
    }

    #app > .ant-layout:last-child {
        margin: 0;
    }
</style>
